<template>
  <div>
    <div class="title">工作台/广告内容管理列表</div>

    <div class="box">
      <div class="box-title">
        <i class="el-icon-search"></i>
        <span>&nbsp; 筛选查询</span>
      </div>

      <el-form
        :inline="true"
        :model="form"
        class="demo-form-inline"
        size="mini"
      >
        <el-form-item class="form-style">
          <el-input v-model="form.user" placeholder="输入名称查询"></el-input>
        </el-form-item>

        <el-form-item class="form-style">
          <el-date-picker
            type="date"
            placeholder="输入发布日期查询"
            v-model="form.date"
            style="width: 100%"
          ></el-date-picker>
        </el-form-item>

        <el-form-item class="form-style">
          <el-select v-model="form.region" placeholder="未发布">
            <el-option label="未发布" value="weifabu"></el-option>
            <el-option label="已发布" value="yifabu"></el-option>
            
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onCheck">查询</el-button>
        </el-form-item>

         <el-form-item>
          <el-button type="primary" @click="onReset">重置</el-button>
        </el-form-item>
      </el-form>

      <el-button type="primary" round class="btn" size="mini">新增广告</el-button>

      <el-table :data="tableData" border class="tables" size="mini">
        <el-table-column prop="id" label="编号" width="119">
        </el-table-column>
        <el-table-column prop="name" label="名称" width="110">
        </el-table-column>
        <el-table-column prop="clause" label="签约条款" width="110">
        </el-table-column>
        <el-table-column prop="clauseMoney" label="签约金" width="110">
        </el-table-column>
        <el-table-column prop="integral" label="积分" width="110">
        </el-table-column>

        <el-table-column prop="nowtime" label="最近操作时间" width="110">
        </el-table-column>
        
        <el-table-column prop="issuetime" label="发布时间" width="110">
        </el-table-column>
        <el-table-column prop="state" label="状态" width="110">
        </el-table-column>
        <el-table-column prop="signPerson" label="操作人" width="110">
        </el-table-column>
         <el-table-column prop="signNum" label="签约数" width="110">
        </el-table-column>
         <el-table-column prop="browseNum" label="浏览数" width="110">
        </el-table-column>
        <el-table-column prop="operation" label="操作" width="180">
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        date: "",
        type: [],
        user: "",
        region: "",
      },

      // 表格
      tableData: [
        {
          id: "123",
          name: "hahha",
          clause:'123546',
          clauseMoney: "123456789",
          integral: "6",
          nowtime:'2021',
          issuetime: "2021",
          state: "aa",
          signPerson: "sdfs",
          signNum:'10',
          browseNum:'11',
          operation: "",
        },
        {
          id: "123",
          name: "hahha",
          clause:'123546',
          clauseMoney: "123456789",
          integral: "6",
          nowtime:'2021',
          issuetime: "2021",
          state: "aa",
          signPerson: "sdfs",
          signNum:'10',
          browseNum:'11',
          operation: "",
        },
      ],
    };
  },
  methods: {
    onCheck() {
      
    },
    onReset(){},
  },
};
</script>

<style scoped>
.title {
  text-align: left;
  padding-left: 200px;
  padding-top: 20px;
}
.box {
  width: 1400px;
  height: 170px;
  background: rgba(242, 242, 242, 1);
  margin: 20px;
  margin-left: 200px;
}
.box-title {
  float: left;
  margin: 20px 1000px 30px 150px;
  font-weight: 800;
}
.form-style {
  margin-right: 70px;
}

.tables {
  width: 1400px;
  margin-top: 80px;
}
.btn{
  float: left;
  margin-left: 150px;
}
</style>